import React, { Component } from 'react';
import {
    View,
} from 'react-native';

export default class NavigatorBarView extends Component {
    constructor(props) {
        super(props);
    }
    static defaultProps = {
        leftItem: null,
        centerItem: null,
        rightItem: null,
    };

    render() {
        content=[];
        if (this.props.leftItem) {
            content.push(React.cloneElement(this.props.leftItem,
                {
                    key:'left'
                }));
        }
        content.push(<View key="leftFelx" style={{flex: 0.5}}></View>);

        if (this.props.centerItem) {
            content.push(React.cloneElement(this.props.centerItem,
                {
                    key:'center'
                }));
        }
        content.push(<View key="centerFlex" style={{flex: 1}}></View>);

        if (this.props.rightItem) {
            content.push(React.cloneElement(this.props.rightItem,
                {
                    key:'right'
                }));
        }
        return (<View
            style={{
                backgroundColor: '#00bfff',
                width: Common.size.width,
                height: Common.size.barTop,
            }}>
            <View style={{
                position: 'absolute',
                bottom: 0,
                left: 0,
                height:Common.size.navBarHeight,
                width: Common.size.width,
                flexDirection: 'row',
                alignItems:'center'
            }}>
                {content}
            </View>

        </View>);
    }
}